/*
* This file is part of syberos-settings
*
* Copyright (C) 2014 Beijing Yuan Xin Technology Co.,Ltd. All rights reserved.
*
* Authors:
*       Lele Huan <huanlele@syberos.com>
*
* This software, including documentation, is protected by copyright controlled
* by Beijing Yuan Xin Technology Co.,Ltd. All rights are reserved.
*/

import QtQuick 2.1
import QtQuick.Controls 1.0
import QtQuick.Controls 1.0
import "constants.js" as UI
Rectangle{
    id:iniputItem
    property string itemId: ""
    property string lableTitle: ""
    property alias inputText: inputEdit.text
    property alias validator: inputEdit.validator
    property alias echoMode: inputEdit.echoMode
    property alias maximumLength: inputEdit.maximumLength

    property bool passwordEnabled: false
    property string editPlaceHoldeText:""
    property int iniputItemHeight: UI.LIST_ITEM_HEIGHT
    property alias inputMethodhints: inputEdit.inputMethodHints
    property int mainTextFontPixelSize: UI.LIST_TITLE_SIZE
    property string mainTextFontFamily: UI.DEFAULT_FONTFAMILY
    property string mainTextFontColor: UI.LIST_TITLE_COLOR

    property int inputTextFontPixelSize:UI.LIST_SUBTILE_SIZE
    property string inputTextFontFamily: UI.DEFAULT_FONTFAMILY
    property string inputTextFontColor: UI.LIST_SUBTITLE_COLOR

    width: parent.width
    height: titleLabel.height > iniputItem.iniputItemHeight?
                titleLabel.height:iniputItem.iniputItemHeight
    property alias titleWidth: labelRect.width
    property alias isFocus: inputEdit.focus
    signal textFocusChanged(bool focus)
    signal textChanged(string text)
    signal search(string text)
    function forceActiveFocus(){
        console.log("inputEdit.forceActiveFocus()-------------------------------------;  ")
        inputEdit.forceActiveFocus();
    }

    Rectangle{
        id:labelRect
        width: parent.width*0.35
        height: parent.height

        Label {
            id: titleLabel
            anchors.verticalCenter: parent.verticalCenter
            text: lableTitle
            horizontalAlignment:Text.AlignLeft
            anchors.left: parent.left
            anchors.right: parent.right
            anchors.leftMargin: UI.LIST_ICON_MARGIN_LEFT
            elide:Text.ElideRight
            font.pixelSize: iniputItem.mainTextFontPixelSize
            font.family:iniputItem.mainTextFontFamily
            color:iniputItem.mainTextFontColor
        }

//        Rectangle{
//            anchors.right: parent.right
//            width: UI.LIST_SEPARETOR_LINE_HEIGHT
//            height: parent.height
//            color: UI.LIST_SEPARETOR_LINE_COLOR
//        }
    }


    Image
    {
        id: searchImg
        source: "qrc:/icon/res/search.png"
        anchors.right: parent.right
        height: parent.height
        width: height
    }

    MouseArea
    {
        anchors.fill: searchImg
        onClicked:  iniputItem.search(inputEdit.text)
    }

    Rectangle{
        id:inputRect
        anchors.left: labelRect.right
        anchors.right: searchImg.left
        height: parent.height
        border.color: "black"
        border.width: 2

        TextField {
            id: inputEdit
            //text:qsTr(model.data)+app.transflag
            placeholderText: iniputItem.editPlaceHoldeText
            clip: true
            textColor:"#000000"
            anchors.fill: parent
            //anchors.rightMargin: 20
            //anchors.leftMargin: 20
            font.pixelSize: 30
            onTextChanged:{
                console.log("input test is  ", text)
                iniputItem.textChanged(text);
            }
            function findFlickable(item){
                var next = item;
                while (next) {
                    if (next.flicking !== undefined && next.flickableDirection !== undefined)
                        return next;
                    next = next.parent;
                }
                return null;
            }
            onFocusChanged: {
                console.log("onFocusChanged ------------------  ", focus)
                textFocusChanged(focus)
            }

        }
    }
    Rectangle {
        height: UI.LIST_SEPARETOR_LINE_HEIGHT; width: parent.width
        anchors.bottom: parent.bottom
        color: UI.LIST_SEPARETOR_LINE_COLOR
    }
}//end Item
